.upload {
    border: dashed 2px #ccc;
    border-radius: 8px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.desc {
    color: #9D9D9D;
    font-size: 14px;
}
.file-list {
    max-height: 300px;
    overflow: auto;
    scorllbar-width: none;
    &::-webkit-scrollbar {
        width: 0;
    }
    .file-item {
        border-radius: 4px;
        padding: 2px 4px;
        display: flex;
        align-items: center;
        gap: 4px;
    }
    .file-state {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        width: 80px;
        color: #047600;
    }
    .file-name {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        max-width: 280px;
    }
}
.file-search {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 4px 1px;
    :global {
        .seal-input-group .seal-input-inner-container:focus-within {
            outline: 1px solid #59a041;
        }
    }
}
.checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: 4px;

    .delete {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        color: #f92c38;
        cursor: pointer;
        margin-left: auto;
        padding: 4px 6px;
        transition: all 0.3s ease-in-out;
        border-radius: 4px;
        &:hover {
            background-color: #ffe2e4;
        }
    }
}
.checkbox {
    cursor: pointer;
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: white;
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: currentColor;
    width: 1.15em;
    height: 1.15em;
    border: 0.15em solid #D7D8DD;
    border-radius: 0.3em;

    display: grid;
    place-content: center;

    &::before {
        content: "";
        width: 0.65em;
        height: 0.65em;
        clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
        transform: scale(0);
        transform-origin: bottom left;
        transition: 120ms transform ease-in-out;
        background-color: white;
    }

    &:checked {
        background-color: #59a041;
        border: 0.15em solid #c7eaba;
        transition: all 120ms ease-in-out;
    }

    &:checked::before {
        transform: scale(1);
    }

    &:disabled {
        border: 0.15em solid #e6e6e6;
        background: #cdcdcd;
        transition: all 120ms ease-in-out;
        cursor: not-allowed;
    }
}
.mixed-checkbox {
    &:checked {
        background: radial-gradient(#59a041 50%, #59a041 50%, white 100%);
    }
    &::before {
        background-color: #59a041;
    }
}
.modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 24px;
    .confirm {
        color: #f92c38;
        cursor: pointer;
        padding: 4px 6px;
        transition: all 0.3s ease-in-out;
        border-radius: 4px;
        background-color: #ffe2e4;
        &:hover {
            color: red
        }
    }
    .cancel {
        color: #929292;
        cursor: pointer;
        padding: 4px 6px;
        transition: all 0.3s ease-in-out;
        border-radius: 4px;
        &:hover {
            background-color: #f2f2f2;
        }
    }
}
.dragger {
    :global {
        .ant-upload-list-item-name {
            max-width: 320px;
        }
    }
}

